<template>
  <div class="app-container">
    <complex-table ref="loginInfoComplexTable" :datas="tableData" />
  </div>
</template>

<script>
import ComplexTable from '@/components/ComplexTable/index'
import ContentBox from '@/layout/components/ContentBox'
import { search as searchApi, dels, clean } from '@/api/logininfor'

export default {
  name: 'Logininfor'
  , components: { ComplexTable, ContentBox }
  , data() {
    return {
      tableData: {
        full: 222
        , title: '登录日志'
        , page: true // 开启分页
        , searchList: searchApi // 搜索接口
        , cols: [[ // 表头
          { type: 'checkbox', align: 'center', fixed: 'left' }
          , { field: 'id', type: 'long', align: 'center', title: '编号', fixed: 'left', search: true }
          , { field: 'login_name', type: 'string', title: '登录名称', fixed: 'left', search: true }
          , { field: 'login_ip', type: 'string', title: '登录IP', search: true }
          , { field: 'login_location', type: 'string', title: '登录地点' }
          , { field: 'browser', type: 'string', title: '浏览器' }
          , { field: 'platform', type: 'string', title: '操作系统' }
          , { field: 'status', type: 'tag', title: '登录状态', align: 'center', selections: [
            { label: '成功', value: 1, type: 'success' }
            , { label: '失败', value: 0, type: 'danger' }
          ] }
          , { field: 'msg', type: 'string', title: '操作信息' }
          , { field: 'created_at', type: 'date-time', title: '操作时间', align: 'center', sort: true }
        ]]

        , buttonBars: [
          {
            type: 'danger'
            , title: '删除'
            , icon: 'el-icon-delete'
            , event: this.delsAction
            , disabled: (selections) => {
              return !selections || selections.length <= 0
            }
          }
          , {
            type: 'danger'
            , title: '清空'
            , icon: 'el-icon-close'
            , event: this.cleanAction
            , disabled: (selections, total) => {
              return total <= 0
            }
          }
        ]
      }
    }
  }
  , created() {

  }
  , methods: {
    delsAction(selects) {
      if (selects && selects.length > 0) {
        const ids = selects.map(val => val.id).join(',')
        this.$confirm('是否确认删除ID为[' + ids + ']的数据项?', '警告', {
          confirmButtonText: '确定'
          , cancelButtonText: '取消'
          , type: 'warning'
        }).then(() => {
          dels(ids).then(res => {
            // 获取数据
            this.$refs.loginInfoComplexTable.getList()
            // 提示信息
            this.$message({ message: res.message, type: 'success' })
          })
        }).catch(() => {})
      }
    }

    , cleanAction(selects, total) {
      if (total > 0) {
        this.$confirm('是否确认清空所有数据项?', '警告', {
          confirmButtonText: '确定'
          , cancelButtonText: '取消'
          , type: 'warning'
        }).then(() => {
          clean().then(res => {
            this.currentPage = 1
            // 获取数据
            this.$refs.loginInfoComplexTable.getList()
            // 提示信息
            this.$message({ message: res.message, type: 'success' })
          })
        }).catch(() => {})
      }
    }
  }
}
</script>
